<template>
  <div>
    <img :src="svgUrl">
  </div>
</template>

<script>
import axios from "axios";
import store from "@/store";

export default {
  name: 'svgNode',
  props: ['svgIndex'],
  data() {
    return {
      svgList:[],
      svgUrl:'',
    }
  },
  watch:{
    'SvgIndex':{
      immediate:true,
      handler(){
        this.svgUrl = this.svgList[this.SvgIndex].priview_img
      }
    }
  },
  computed:{
    SvgIndex(){
      return store.state.svgIndex
    }
  },
  mounted() {
    this.getSvgInfo()
  },
  methods:{
    getSvgInfo(){
      axios.get("InterfaceReturn.json")
          .then((res) => {
            if(res.data !== null && res.data.length > 0){
              this.svgList = res.data
              this.svgUrl = res.data[0].priview_img
            }
          })
    }
  }
}
</script>

<style scoped>

</style>